<template>
  <div>
    <article class="innerPage bookList">
      <header class="breadcrumb">
        <x-breadcrumb
          :path="$route.path"
          :title="$route.meta.breadcrumb"
          :startIndex="$route.meta.startIndex"
        >
        </x-breadcrumb>
      </header>
      <section>
        <div class="from_post form_class">
          <el-form label-width="150px" ref="ruleForm">
            <el-form-item label="活动封面" v-if="fromData.img">
              <a target="_blank" :href="$img(fromData.img)">
                <div class="coverImg">
                  <img :src="$img(fromData.img)" :onerror="$errImg" />
                </div>
              </a>
            </el-form-item>
            <el-form-item label="活动名称">
              <div class="text_class">
                {{ fromData.title }}
              </div>
            </el-form-item>
            <el-form-item label="活动类型" v-if="fromData.type_id">
              <div class="text_class">
                {{ nodeFun(fromData.type_id) }}
              </div>
            </el-form-item>
            <el-form-item
              label="技术支持单位"
              v-if="fromData.technical_support"
            >
              <div class="text_class">
                {{ fromData.technical_support }}
              </div>
            </el-form-item>
            <el-form-item
              label="前端是否显示区域和馆列表"
              v-if="fromData.type_id == 3"
            >
              <div class="text_class">
                {{ fromData.is_show_list === "1" ? "显示" : "不显示" }}
              </div>
            </el-form-item>
            <el-form-item
              label="前端是否显示馆列表"
              v-if="fromData.type_id == 2"
            >
              <div class="text_class">
                {{ fromData.is_show_list === 1 ? "显示" : "不显示" }}
              </div>
            </el-form-item>
            <el-form-item label="答题模式">
              <div class="text_class">
                <!-- "pattern": 1,答题模式 1 馆内答题形式 2 轮次排名形式 （按轮次排名） 3 爬楼梯形式  -->
                {{
                  fromData.pattern == 1
                    ? "馆内答题"
                    : fromData.pattern == 2
                    ? "轮次排名"
                    : "爬楼梯"
                }}
              </div>
            </el-form-item>
            <el-form-item label="开奖形式">
              <div class="text_class">
                {{ fromData.shape === 1 ? "排名" : "抽奖" }}
              </div>
            </el-form-item>
            <el-form-item label="是否需要填写地址">
              <div class="text_class">
                {{ fromData.is_show_address === 1 ? "需要" : "不需要" }}
              </div>
            </el-form-item>
            <el-form-item label="所属馆确定">
              <div class="text_class">
                {{ isFun(fromData.isbelong) }}
              </div>
            </el-form-item>
            <el-form-item label="每日答题次数" v-if="fromData.replace_num">
              <div class="text_class">
                {{ fromData.replace_num }}
              </div>
            </el-form-item>
            <el-form-item label="每日答题轮次" v-if="fromData.round">
              <div class="text_class">
                {{ fromData.round }}
              </div>
            </el-form-item>
            <el-form-item label="每轮题目数量" v-if="fromData.round_num">
              <div class="text_class">
                {{ fromData.round_num }}
              </div>
            </el-form-item>
            <el-form-item label="获取奖票间隔数" v-if="fromData.interval_num">
              <div class="text_class">
                {{ fromData.interval_num }}
              </div>
            </el-form-item>
            <el-form-item label="馆内答题数量" v-if="fromData.museum_num">
              <div class="text_class">
                {{ fromData.museum_num }}
              </div>
            </el-form-item>
            <el-form-item label="每日分享次数" v-if="fromData.share_num">
              <div class="text_class">
                {{ fromData.share_num }}
              </div>
            </el-form-item>
            <el-form-item label="答题时长">
              <div class="text_class">
                {{ fromData.answer_time }}
              </div>
            </el-form-item>
            <el-form-item label="活动时间">
              <div class="text_class">
                {{ fromData.activity_time_start
                }}<span style="margin: 0 10px">~</span
                >{{ fromData.activity_time_end }}
              </div>
            </el-form-item>
            <el-form-item label="答题时间">
              <div class="text_class">
                {{ fromData.answer_times_start
                }}<span style="margin: 0 10px">~</span
                >{{ fromData.answer_times_end }}
              </div>
            </el-form-item>
            <el-form-item label="抽奖时间" v-if="fromData.draw_times_start">
              <div class="text_class">
                {{ fromData.draw_times_start
                }}<span style="margin: 0 10px">~</span
                >{{ fromData.draw_times_end }}
              </div>
            </el-form-item>
            <el-form-item
              :label="fromData.isrule == 1 ? '活动规则' : '活动规则外部链接'"
            >
              <div class="ql-container2 ql-snow2" v-if="fromData.isrule == 1">
                <div class="ql-editor">
                  <div class="previewCxt-box" v-html="fromData.intro"></div>
                </div>
              </div>
              <div v-if="fromData.isrule == 2" class="herfs-box">
                <a target="_blank" :href="fromData.rulelink">
                  {{ fromData.rulelink }}
                </a>
              </div>
            </el-form-item>
            <el-form-item
              label="答题规则"
              v-if="fromData.answer_rule && fromData.node != 1"
            >
              <div class="text_class">
                {{
                  fromData.answer_rule == 2
                    ? "优先回答专属题"
                    : "专属题和公共题混合"
                }}
              </div>
            </el-form-item>
            <el-form-item label="活动邀请码" v-if="fromData.invitation_code">
              <div class="text_class">
                {{ fromData.invitation_code }}
              </div>
            </el-form-item>
            <el-form-item label="分享标题" v-if="fromData.share_title">
              <div class="text_class">
                {{ fromData.share_title }}
              </div>
            </el-form-item>
            <el-form-item label="分享图片" v-if="fromData.share_img">
              <a target="_blank" :href="$img(fromData.share_img)">
                <div class="coverImg">
                  <img :src="$img(fromData.share_img)" :onerror="$errImg" />
                </div>
              </a>
            </el-form-item>
            <el-form-item label="我的成绩单slogan1" v-if="fromData.slogan1">
              <div class="text_class">
                {{ fromData.slogan1 }}
              </div>
            </el-form-item>
            <el-form-item label="我的成绩单slogan2" v-if="fromData.slogan2">
              <div class="text_class">
                {{ fromData.slogan2 }}
              </div>
            </el-form-item>
            <el-form-item>
              <div style="padding: 48px 0 48px 0" class="btn_el">
                <el-button
                  @click="submitForm()"
                  class="btn_establish"
                  v-if="is_paly != 1"
                >
                  修改
                </el-button>
                <el-button class="btn_cancel" @click="can">取消</el-button>
              </div>
            </el-form-item>
          </el-form>
        </div>
      </section>
    </article>
  </div>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      fromData: {
        img: "", //封面
        title: "", //名称
        type_id: "", //活动类型
        pattern: "", //答题模式
        shape: "", //开奖形式
        isuser: 1, //是否为阅享用户
        real_info: [], //需要填写真实信息的id
        isbelong: 1, //所属馆确定
        replace_num: "", //每日答题次数
        share_num: "", //每日分享次数
        answer_time: "", //答题时间
        isrule: 1, //活动规则
        rulelink: "", //外部链接
        intro: "", //富文本
        activity_time_start: "", //活动开始时间
        activity_time_end: "", //活动结束时间
        answer_times_start: "", //答题开始时间
        answer_times_end: "", //答题结束时间
        draw_times_start: "", //抽奖开始时间
        draw_times_end: "", //抽奖结束时间
        invitation_code: "", //邀请码
        round: "", //每日答题轮次
        round_num: "", //每轮题目数量
        interval_num: "", //获取奖票间隔数
        museum_num: "", //馆内答题数量
        iscirculation: 1, //馆内答题完成是否可循环
        is_need_unit: "",
        node: "",
        answer_rule: "",
        is_show_list: 1,
        slogan1: "",
        slogan2: "",
        share_title: "",
        share_img: "",
        is_show_address: 1,
        technical_support: "",
      },
      list: [],
      is_paly: "",
    };
  },
  computed: {
    defaultImg() {
      return 'this.src="' + require("@/assets/img2/feng_shibaiimg.png") + '"';
    },
  },
  watch: {},
  activated() {
    this.is_paly = this.$route.query.is_apply;
   //  this.setPageTabs();
    if (this.$route.query.action) {
      if (this.$route.query.action != "refresh") {
        this.fromData = this.$options.data().fromData;
        this.getinfo();
      }
    } else {
      this.fromData = this.$options.data().fromData;
      this.getinfo();
    }
  },
  mounted() {},
  methods: {
    //== 1 ? '需要' : '不需要'
    isFun(type) {
      if (type == 1 && this.fromData.type_id != 1) {
        return "需要";
      } else {
        return "不需要";
      }
    },
    //获取活动类型数据
    async gettypeList() {
      try {
        let res = await this.request({
          url: "/admin/answerActivity/getNodeName",
          method: "get",
          loading: false,
          data: {},
        });
        if (res) {
          this.list = res.content;
        }
      } catch (err) {
        this.errorHandler(err);
      }
    },
    nodeFun(id) {
      let name;
      if (id == 1) {
        return "独立活动";
      } else if (id == 2) {
        return "单位联盟";
      } else if (id == 3) {
        return "区域联盟";
      }
      // this.list.map((item, index) => {
      //   if (item.id == id) {
      //     name = item.name
      //     console.log(name)
      //   }
      // })
      // return name
    },
    //获取详情
    async getinfo() {
      try {
        let res = await this.request({
          url: "/admin/bookHomeBannerShop/detail",
          method: "get",
          loading: true,
          data: {
            id: this.$route.query.id,
          },
        });
        if (res) {
          this.fromData.img = res.content.img; //封面
          this.fromData.title = res.content.title; //名称
          this.fromData.type_id = res.content.node; //活动类型
          this.fromData.pattern = res.content.pattern; //答题模式
          this.fromData.shape = res.content.prize_form; //开奖形式
          this.fromData.real_info = res.content.real_info
            ? res.content.real_info.split("|")
            : []; //需要填写真实信息的id
          this.fromData.isbelong = res.content.is_need_unit; //所属馆确定
          if (this.fromData.pattern == 2) {
            this.fromData.round = res.content.number; //每日答题轮次
          } else {
            this.fromData.replace_num = res.content.number; //每日答题次数
          }
          //
          if (this.fromData.pattern == 2) {
            this.fromData.round_num = res.content.answer_number; //每轮题目数量
          } else {
            if (this.fromData.pattern == 1) {
              this.fromData.museum_num = res.content.answer_number; //馆内答题数量
            } else {
              if (this.fromData.pattern == 3) {
                if (this.fromData.shape == 2) {
                  this.fromData.interval_num = res.content.answer_number; //获取奖票间隔数
                }
              }
            }
          }
          this.fromData.share_num = res.content.share_number; //每日分享次数
          this.fromData.answer_time = res.content.answer_time; //答题时间
          this.fromData.isrule = res.content.rule_type;
          if (res.content.rule_type == 1) {
            this.fromData.intro = res.content.rule; //富文本
          } else if (res.content.rule_type == 2) {
            this.fromData.rulelink = res.content.rule; //外部链接
          }
          this.fromData.activity_time_start = res.content.start_time;
          this.fromData.activity_time_end = res.content.end_time;
          this.fromData.answer_times_start = res.content.answer_start_time;
          this.fromData.answer_times_end = res.content.answer_end_time;
          this.fromData.draw_times_start = res.content.lottery_start_time;
          this.fromData.draw_times_end = res.content.lottery_end_time;
          this.fromData.invitation_code = res.content.invite_code;
          this.fromData.slogan1 = res.content.slogan1;
          this.fromData.slogan2 = res.content.slogan2;
          this.fromData.share_title = res.content.share_title;
          this.fromData.share_img = res.content.share_img;
          this.fromData.is_show_address = res.content.is_show_address || 1;
          this.fromData.answer_rule = res.content.answer_rule;
          if (res.content.is_show_list) {
            this.fromData.is_show_list = res.content.is_show_list;
          }
          this.fromData.technical_support = res.content.technical_support;
        }
      } catch (err) {
        this.errorHandler(err);
      }
    },
    submitForm() {
      this.$router.push({
        path:
          "/answerActivities/activityList/activitYamend?id=" +
          this.$route.query.id +
          "&type=" +
          "no",
      });
    },
    can() {
      // this.$router.go(-1)
      if (this.$route.query.action) {
        this.$delete(this.$route.query, "action");
      }
      this.pageTurn("/answerActivities/activityList");
    },
  },
};
</script>
<style lang="scss" scoped>
@import "./style.scss";
</style>
<style lang="sass">
.el_class{
  font-size: 14px;
  font-family: Microsoft YaHei, Microsoft YaHei-Regular;
  font-weight: 400;
  text-align: right;
  color: #000000;
}
</style>
